﻿
@inject DataSource Data

<p>To test set ResizeType on the DataGrid to either DataGridResizeType.Discrete or DataGridResizeType.Exact</p>
<p>Remove the parameter completely to get the original behavior</p>

<FluentDataGrid Items="@FilteredItems"
                ResizableColumns=true
                ResizeType="DataGridResizeType.Discrete"
                Pagination="@pagination"
                GridTemplateColumns="0.2fr 1fr 0.2fr 0.2fr 0.2fr 0.2fr"
                RowClass="@rowClass"
                RowStyle="@rowStyle"
                HeaderCellAsButtonWithMenu="true"
                Style="height: 405px;overflow:auto;"
                ColumnResizeLabels="@customLabels">
    <TemplateColumn Tooltip="true" HeaderTooltip="Flag of each team" TooltipText="@(c => "Flag of " + c.Name)" Title="Rank" SortBy="@rankSort" Align="Align.Center" InitialSortDirection="SortDirection.Ascending" IsDefaultSortColumn=true>
        <img class="flag" src="_content/FluentUI.Demo.Shared/flags/@(context.Code).svg" alt="Flag of @(context.Code)" />
    </TemplateColumn>
    <PropertyColumn Property="@(c => c.Name)" Sortable="true" Filtered="!string.IsNullOrWhiteSpace(nameFilter)" Tooltip="true" Title="Name of the country">
        <ColumnOptions>
            <div class="search-box">
                <FluentSearch Autofocus=true @bind-Value=nameFilter @oninput="HandleCountryFilter" @bind-Value:after="HandleClear" Placeholder="Country name..." Style="width: 100%;" Label="Filter" />
            </div>
        </ColumnOptions>
    </PropertyColumn>
    <PropertyColumn Property="@(c => c.Medals.Gold)" Sortable="true" Align="Align.Start" Tooltip="true" TooltipText="@(c => "That is " + c.Medals.Gold + " x GOLD!!")" />
    <PropertyColumn Property="@(c => c.Medals.Silver)" Sortable="true" Align="Align.Center" Tooltip="true" />
    <PropertyColumn Property="@(c => c.Medals.Bronze)" Sortable="false" Align="Align.End" />
    <PropertyColumn Property="@(c => c.Medals.Total)" Sortable="true" Filtered="@(minMedals != 0 || maxMedals != 130)" Align="Align.End" Tooltip="true">
        <ColumnOptions>
            <div style="width: 100%; height: 150px;">
                <FluentSlider Label="@($"Min ({minMedals})")" Min="0" Max="150" Step="1" Orientation="Orientation.Horizontal" @bind-Value=minMedals Immediate="true" Style="width: 100%;">
                    <FluentSliderLabel Position="0">0</FluentSliderLabel>
                    <FluentSliderLabel Position="50">50</FluentSliderLabel>
                    <FluentSliderLabel Position="100">100</FluentSliderLabel>
                    <FluentSliderLabel Position="150">150</FluentSliderLabel>
                </FluentSlider>
                <br /><br />
                <FluentSlider Label="@($"Max ({maxMedals})")" Min="0" Max="150" Step="1" Orientation="Orientation.Horizontal" @bind-Value=maxMedals Immediate="true" Style="width: 100%;">
                    <FluentSliderLabel Position="0">0</FluentSliderLabel>
                    <FluentSliderLabel Position="50">50</FluentSliderLabel>
                    <FluentSliderLabel Position="100">100</FluentSliderLabel>
                    <FluentSliderLabel Position="150">150</FluentSliderLabel>
                </FluentSlider>
            </div>
        </ColumnOptions>
    </PropertyColumn>
</FluentDataGrid>


<FluentPaginator State="@pagination" />

<FluentSwitch @bind-Value="@_clearItems"
              @bind-Value:after="ToggleItemsAsync"
              UncheckedMessage="Clear all results"
              CheckedMessage="Restore all results">
</FluentSwitch>

@code {
    bool _clearItems = false;
    IQueryable<Country>? items;
    PaginationState pagination = new PaginationState { ItemsPerPage = 10 };
    string nameFilter = string.Empty;
    int minMedals;
    int maxMedals = 130;

    ColumnResizeLabels customLabels = ColumnResizeLabels.Default with { DiscreteLabel = "Width (+/- 10px)", ResetAriaLabel = "Restore" };

    GridSort<Country> rankSort = GridSort<Country>
        .ByDescending(x => x.Medals.Gold)
        .ThenDescending(x => x.Medals.Silver)
        .ThenDescending(x => x.Medals.Bronze);

    Func<Country, string?> rowClass = x => x.Name.StartsWith("A") ? "highlighted-row" : null;
    Func<Country, string?> rowStyle = x => x.Name.StartsWith("Au") ? "background-color: var(--highlight-bg)" : null;

    //IQueryable<Country>? FilteredItems => items?.Where(x => x.Name.Contains(nameFilter, StringComparison.CurrentCultureIgnoreCase));

    IQueryable<Country>? FilteredItems
    {
        get
        {
            var result = items?.Where(c => c.Medals.Total <= maxMedals);

            if (result is not null && !string.IsNullOrEmpty(nameFilter))
            {
                result = result.Where(c => c.Name.Contains(nameFilter, StringComparison.CurrentCultureIgnoreCase));
            }

            if (result is not null && minMedals > 0)
            {
                result = result.Where(c => c.Medals.Total >= minMedals);
            }

            return result;
        }
    }

    protected override async Task OnInitializedAsync()
    {
        items = (await Data.GetCountriesAsync()).AsQueryable();
    }

    private void HandleCountryFilter(ChangeEventArgs args)
    {
        if (args.Value is string value)
        {
            nameFilter = value;
        }
    }

    private void HandleClear()
    {
        if (string.IsNullOrWhiteSpace(nameFilter))
        {
            nameFilter = string.Empty;
        }
    }

    private async Task ToggleItemsAsync()
    {
        if (_clearItems)
        {
            items = null;
        }
        else
        {
            items = (await Data.GetCountriesAsync()).AsQueryable();
        }
    }
}
